<!DOCTYPE html>
<html lang="zh-cn">
<head>
    <meta charset="UTF-8" />
    <title>测试</title>
    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0, user-scalable=no">
    <meta name="apple-mobile-web-app-capable" content="yes">
    <meta name="apple-touch-fullscreen" content="yes">
    <meta http-equiv="Access-Control-Allow-Origin" content="*">
    <link rel="stylesheet" href="css/reset.css" />
    <link rel="stylesheet" href="css/animate.css" />
    <link rel="stylesheet" href="css/swiper-3.4.1.min.css" />
    
    <link rel="stylesheet" href="css/layout.css" />
    <link rel="stylesheet" href="css/weui.css" />
    
    <!--<script src="/static/js/jquery-1.9.1.min.js"></script>-->
    <script src="js/jquery.min.js"></script>
    <script src="js/zepto.min.js"></script>
    <script src="js/fontSize.js"></script>
    <script src="js/swiper-3.4.1.min.js"></script>
    <script src="js/wcPop.js"></script>
    <script src="js/weui.min.js"></script>
    <link rel="stylesheet" href="css/jquery.fancybox.min.css" />
<script src="js/jquery.fancybox.min.js"></script>
    <script src="js/jquery.cookie.js"></script>
<script src="js/recorder-core.js"></script>
<script src="js/mp3.js"></script>
<script src="js/mp3-engine.js"></script>
</head>
<style type="text/css">
    div#J__popupTmpl-Hongbao {
    
    background-color: #e35449;
    padding: 0 .25rem;
    line-height: .7rem;
    height: 420px;
     top: 1.6rem;
    /** position: fixed;
    top: 1.6rem;
    height: 370px;
    /**width: 100%;**/
    
   
}

div#J__popupTmpl-Hongbao2 {
    
    background-color: #e35449;
    padding: 0 .25rem;
    line-height: .7rem;
    height: 370px;
     top: 1.6rem;
    /** position: fixed;
    top: 1.6rem;
    height: 370px;
    /**width: 100%;**/
    
   
}


.wc__popupTmpl.tmpl-hongbao {
    margin-top: 30px;
}
li.amountTotal {
    color: #ffeac0 !important;
}

/**红包样式**/
        .hongbaoljc {
   background-color: #f99d3a;
    padding: 0 .25rem;
    line-height: .7rem;
    height: 100px;
    top: 1.6rem;
    width: 250px;
    sborder-radius: 5px;
}
em.usernum {
    color: #fff;
    font-size: 20px;
    font-family: 微软雅黑;
}
.hbimg {
    -o-transition: transform 0.4s;
    transition: transform 0.4s;
    -ms-transform: translateX(-10px);
    -o-transform: translateX(-10px);
    transform: translatey(10px);
}
/**红包点击模板样式**/
.north {
    background-color: #ef5e54;
    height: 64%;
    border: 1px solid #ea5a50;
    border-radius: 4px 4px 50% 50% / 4px 4px 13% 13%;
    box-shadow: 0px 3px 0px -1px rgba(97, 95, 95, 0.04);
}

.avatar {
    position: relative;
}

.avatar .avatar-wrap {
    width: 50px;
    height: 50px;
    margin-top: 10%;
    position: relative;
    left: 50%;
    margin-left: -25px;
}

 .avatar .avatar-wrap img {
    border-radius: 50%;
    overflow: hidden;
    margin-top: 10%;
    width: 100%;
    height: 100%;
}

 .nickName {
text-align: center;
    margin: 8px 0;
    color: #dcbb89;
    font-size: 14px;
}

 .hint {
 text-align: center;
    margin: 6px 0;
    color: #dcbb89;
    font-size: 14px;
}

 .msg {
 text-align: center;
    margin: 30px 0;
    font-size: 22px;
    color: #FBDAA8;
}

 .chai {
 margin-left: 35%;
 text-align: center;
    width: 80px;
    height: 80px;
    border: 1px solid #FFA73A;
    background-color: #FFA73A;
    border-radius: 50%;
    color: #000;
    font-size: 20px;
    display: inline-block;
    margin-top: -40px;
    box-shadow: 0px 4px 0px 0px rgba(0, 0, 0, 0.2);
    -webkit-animation: chai-show .2s 1;
    animation: chai-show .2s 1;
}

.chai .chai-border {
    width: 74px;
    height: 74px;
    border: 1px solid rgba(88, 87, 87, 0.06);
    border-radius: 50%;
    margin: 2px auto 2px;
}
 .chai .chai-border span {
 line-height: 23px;
    margin-top: 23px;
    display: inline-block;
    font-size: 35px;
}
/**抢到红包**/
div#Hongbao4 {
    background-color: #FFF;
}

.ng-binding {
    text-align: -webkit-left;
    /**background-color: #FFFF;**/
    width: 190px;
}

.hbimg {
    margin-left: -50px;
}
img.lottery-img {
    height: 40px;
    position: absolute;
    top: 10px;
    left: 8px;
}

.lottery-up {
 background-color: #f99d3a;
    height: 58px;
}

.lottery-content {
    color: #FFF;
    position: absolute;
    top: 10px;
    left: 48px;
    font-size: 13px;
    width: 145px;
    overflow: hidden;
}
    /*声音*/
  a.laba {
    background: url(/img/labayes.png) no-repeat center;
    background-size: .36rem;
    width: .85rem;
    position: relative;
}
    a.laba2 {
    background: url(/img/labano.png) no-repeat center;
    background-size: .36rem;
    width: .85rem;
    position: relative;
}
.u-sx {
    background: url(/img/refresh.png) no-repeat center;
    background-size: .36rem;
    width: 0.55rem;
    position: relative;
}
.barTit.flex1{text-align: center;}
.inner.flexbox {
    background-image: linear-gradient(
90deg
,#f7f7fa 10%,#f7f7fa);
}
html{overflow-y: hidden;}

</style>
<body>
    
    <!-- <>微聊主容器 -->
    <div class="wechat__panel clearfix">
        <div class="wc__chat-wrapper flexbox flex__direction-column">
            <!-- //顶部 -->
            <div class="wc__headerBar fixed">
                <div class="inner flexbox">
                    <a class="back" href="javascript:;" ></a>
                 
                    <h2 class="barTit flex1">测试<!--(105)--></h2>
                    
                 
                
                    <a class="barIco u-qun" href="groupinfo.html"></a>
                </div>
            </div>
            <!-- //微聊消息上墙面板 -->
            <div class="wc__chatMsg-panel flex1">
                <div class="chatMsg-cnt">
                    <ul class="clearfix" id="pagecount2020">
                                        <!--历史消息-->
                    <div id="page_list_1">
                        

                            <li class="others">                         
                                <a class="avatar">
                                    <img src="/img/wchat/tx.jpg#175#406">
                                </a>                         
                                <div class="content">                               
                                    <p class="author">
                                        <a href="/index/index/fdinfo.html?id=884">
                                            <span class="slt">阚英</span>
                                        </a>
                                    </p>                             
                                    <div class="msg " id="picbig">                                  
                                        <p>asd</p>                              
                                    </div>                          
                                </div>                      
                            </li>

                            <li class="me">             
                                <div class="content">                               
                                    <p class="author">
                                        <a href="/index/index/fdinfo.html?id=1847">赫连灯摘</a> 
                                    </p>                             
                                    <div class="msg" id="picbig">                                   
                                        <p>1<br></p>                                
                                    </div>                          
                                </div>                          
                                <a class="avatar"><img src="/img/wchat/tx.jpg#175#406"></a>                     
                            </li>


                    </div>                    
                    <div id="J__chatMsgList"></div>
                </div>
                <!-- //新消息提醒 
                <div class="chatMsg-notice" id="J__chatMsgNotice">14条新消息</div>-->
            </div>
    
            <!-- //微聊底部功能面板 -->
            <div class="wc__footTool-panel">
                <!-- 输入框模块 -->
                <div class="wc__editor-panel wc__borT flexbox">
                
                    <i class="btn btn-vocok" style="display:none;" onclick="recClose()"></i>
                    <div class="wrap-editor flex1"><div class="editor J__wcEditor" contenteditable="true" style="-webkit-user-select:auto;"></div><div class="editor J__voc" style="text-align:center;display:none;background:#eee;border-radius:20px;" id="sendvoc">按下 说话</div></div>
              
                  
                    <button class="btn-submit J__wchatSubmit">发送</button>
                </div>
        <!-- 语音区域 -->
        <div class="revoc" style="position: fixed;z-index: 9999;top:0px;left:0px;width: 100vw;height: 100vh;display: none;">
        <div class="pd recpower" style="display: flex;align-items: center;justify-content: center;width: 100vw;height: 100vh;background: #666;opacity: 0.9;flex-direction: column;">
            <div style="height:100px;width:300px;background:#999;position:relative;">
                <div class="recpowerx" style="height:100px;background:#0B1;position:absolute;"></div>
                <div class="recpowert" style="text-align: center; line-height:100px; position: relative;font-size: 32px;"></div>
            </div>
            <div style="display: flex;align-items: center;justify-content: space-between;width:300px;margin-top: 20px;">
                <div style="width: 40%;padding: 10px;text-align: center;background: #ccc;font-size: 24px;" onclick="recClose()">关闭语音</div>
                <div style="width: 40%;padding: 10px;text-align: center;background:rgb(255, 187, 1);font-size: 24px;" onclick="recStop()">发送语音</div>
            </div>
        </div>
       </div>

                <!-- 表情、选择模块 -->
                <div class="wc__choose-panel wc__borT" style="display: none;">
                    <!-- 表情区域 -->
                    <div class="wrap-emotion" style="display: none;">
                        <div class="emotion__cells flexbox flex__direction-column">
                            <div class="emotion__cells-swiper flex1" id="J__swiperEmotion">
                                <div class="swiper-container">
                                    <div class="swiper-wrapper"></div>
                                    <div class="pagination-emotion"></div>
                                </div>
                            </div>
                            <div class="emotion__cells-footer" id="J__emotionFootTab">
                                <ul class="clearfix">
                                    <li class="swiperTmpl cur" tmpl="swiper__tmpl-emotion01"><img src="/static/img/emotion/face01/face-lbl.png" alt=""></li>
                                    <li class="swiperTmpl" tmpl="swiper__tmpl-emotion02"><img src="/static/gif/1.png" alt=""></li>
                                    <li class="swiperTmpl" tmpl="swiper__tmpl-emotion03"><img src="//tva1.sinaimg.cn/mw1024/006ax0qjgy1gnapx3k1sfj30b40b4js5.jpg" alt=""></li>
                                    <!--
                                    <li class="swiperTmpl" tmpl="swiper__tmpl-emotion04"><img src="/static/img/emotion/face04/face-lbl.gif" alt=""></li>
                                    <li class="swiperTmpl" tmpl="swiper__tmpl-emotion05"><img src="/static/img/emotion/face05/face-lbl.gif" alt=""></li>
                                    <li class="swiperTmpl" tmpl="swiper__tmpl-emotion06"><img src="/static/img/emotion/face06/face-lbl.gif" alt=""></li>
                                    <li class="swiperTmplSet"><img src="/static/img/wchat/icon__emotion-set.png" alt=""></li>-->
                                </ul>
                            </div>
                        </div>
                    </div>
                    <!-- 选择区域 -->
                    <div class="wrap-choose" style="display: none;">
                        <div class="choose__cells">
                            <ul class="clearfix">
                                <li><a class="J__wchatZp" href="javascript:;"><span class="img"><img src="/static/img/wchat/icon__choose-zp.png" /><input type="file" id="idzfilezt" accept="image/*" /></span><em>照片</em></a></li>
                                <li><a class="J__wchatHb" href="javascript:;"><span class="img"><img src="/static/img/wchat/icon__choose-hb.png" /></span><em>红包</em></a></li>
                            </ul>
                        </div>
                    </div>
                </div>
                <!-- 全员禁言 -->
                <div class="wc__talk-notAllowed wc__borT flexbox" style="display: none;">
                    <span class="flex1"></span>
                </div>
            </div>
        </div>
    </div>


    <!-- …… 图片预览弹窗.Start -->
    <div class="wc__popup-imgPreview" style="display: none;">
        <div class="swiper-container J__swiperImgPreview">
            <div class="swiper-wrapper"></div>
            <!-- <div class="swiper-pagination pagination-imgPreview"></div> -->
        </div>
    </div>
    
    <!-- …… 图片预览弹窗.End -->

    <!-- …… 视频预览弹窗.Start -->
    <div class="wc__popup-videoPreview" style="display: none;">
        <i class="wc__videoClose"></i>
        <video id="J__videoPreview" width="100%" height="100%" controls="controls" x5-video-player-type="h5" x5-video-player-fullscreen="true" webkit-playsinline preload="auto"></video>
    </div>
    <script type="text/javascript">
        var video = document.getElementById("J__videoPreview");
        $("#J__chatMsgList li").on("click", ".video", function(){
            video.src = $(this).find("img").attr("videoUrl");
            $(".wc__popup-videoPreview").show();
            if(video.paused){
                video.play();
            }else{
                video.pause();
            }
        });
        video.addEventListener("ended", function(){
            video.currentTime = 0;
        }, false);
        // 关闭预览
        $(".wc__popup-videoPreview").on("click", ".wc__videoClose", function(){
            $(".wc__popup-videoPreview").hide();
            video.currentTime = 0;
            video.pause();
        });

        // 进入全屏、退出全屏
        video.addEventListener("x5videoenterfullscreen", function(){
            console.log("进入全屏");
        }, false);
        video.addEventListener("x5videoexitfullscreen", function(){
            $(".wc__popup-videoPreview .wc__videoClose").trigger("click");
        }, false)
    </script>
    <!-- …… 视频预览弹窗.End -->

    <!-- …… 表情模板.Start -->
    <!-- //表情 -->
    <div class="swiper__tmpl-emotion01" style="display: none;">
        <div class="swiper-slide">
            <div class="face-list face__sm-list">
             <span><img class="face" src="/bqimg/1.png" /></span>
                <span><img class="face" src="https://liao.web265.top/bqimg/2.png" /></span>
                <span><img class="face" src="https://liao.web265.top/bqimg/3.png" /></span>
                <span><img class="face" src="https://liao.web265.top/bqimg/4.png" /></span>
                <span><img class="face" src="https://liao.web265.top/bqimg/5.png" /></span>
                <span><img class="face" src="https://liao.web265.top/bqimg/6.png" /></span>
                <span><img class="face" src="https://liao.web265.top/bqimg/7.png" /></span>
                
                <span><img class="face" src="https://liao.web265.top/bqimg/8.png" /></span>
                <span><img class="face" src="https://liao.web265.top/bqimg/9.png" /></span>
                <span><img class="face" src="https://liao.web265.top/bqimg/10.png" /></span>
                <span><img class="face" src="https://liao.web265.top/bqimg/11.png" /></span>
                <span><img class="face" src="https://liao.web265.top/bqimg/12.png" /></span>
                <span><img class="face" src="https://liao.web265.top/bqimg/13.png" /></span>
                <span><img class="face" src="https://liao.web265.top/bqimg/14.png" /></span>
                
                <span><img class="face" src="https://liao.web265.top/bqimg/15.png" /></span>
                <span><img class="face" src="https://liao.web265.top/bqimg/16.png" /></span>
                <span><img class="face" src="https://liao.web265.top/bqimg/17.png" /></span>
                <span><img class="face" src="https://liao.web265.top/bqimg/18.png" /></span>
                <span><img class="face" src="https://liao.web265.top/bqimg/19.png" /></span>
                <span><img class="face" src="https://liao.web265.top/bqimg/20.png" /></span>
                <span><img class="del" src="https://liao.web265.top/static/img/wchat/icon__emotion-del.png" /></span>
            </div>
        </div>
        <div class="swiper-slide">
            <div class="face-list face__sm-list">
                <span><img class="face" src="//tva1.sinaimg.cn/mw1024/006ax0qjly1g57lzyy2r4j304g04g3yu.jpg" /></span>
                <span><img class="face" src="//tva1.sinaimg.cn/mw1024/006ax0qjly1g57lzzcpjyj304g04g0t0.jpg" /></span>
                <span><img class="face" src="//tva1.sinaimg.cn/mw1024/006ax0qjly1g57lzzos96j304g04gjrm.jpg" /></span>
                <span><img class="face" src="//tva1.sinaimg.cn/mw1024/006ax0qjly1g57m003dd6j304g04g74l.jpg" /></span>
                <span><img class="face" src="//tva1.sinaimg.cn/mw1024/006ax0qjly1g57m00kzt7j304g04g74k.jpg" /></span>
                <span><img class="face" src="//tva1.sinaimg.cn/mw1024/006ax0qjly1g57m00xv2mj304g04gweu.jpg" /></span>
                <span><img class="face" src="//tva1.sinaimg.cn/mw1024/006ax0qjly1g57m01elpij304g04g0t3.jpg" /></span>
                
                <span><img class="face" src="//tva1.sinaimg.cn/mw1024/006ax0qjly1g57m01vfjmj304g04gwet.jpg" /></span>
                <span><img class="face" src="//tva1.sinaimg.cn/mw1024/006ax0qjly1g57m028y8jj304g04gt91.jpg" /></span>
                <span><img class="face" src="//tva1.sinaimg.cn/mw1024/006ax0qjly1g57m02qou0j304g04gmxk.jpg" /></span>
                <span><img class="face" src="//tva1.sinaimg.cn/mw1024/006ax0qjly1g57m0350irj304g04g3yw.jpg" /></span>
                <span><img class="face" src="//tva1.sinaimg.cn/mw1024/006ax0qjly1g57m03hz6jj304g04gq3a.jpg" /></span>
                <span><img class="face" src="//tva1.sinaimg.cn/mw1024/006ax0qjly1g57m041lkjj304g04gwet.jpg" /></span>
                <span><img class="face" src="//tva1.sinaimg.cn/mw1024/006ax0qjly1g57m04db0yj304g04g74m.jpg" /></span>
                
                <span><img class="face" src="//tva1.sinaimg.cn/mw1024/006ax0qjly1g57m04scfnj304g04ggm1.jpg" /></span>
                <span><img class="face" src="//tva1.sinaimg.cn/mw1024/006ax0qjly1g57m057mojj304g04gglx.jpg" /></span>
                <span><img class="face" src="//tva1.sinaimg.cn/mw1024/006ax0qjly1g57m05olfqj304g04gjrm.jpg" /></span>
                <span><img class="face" src="//tva1.sinaimg.cn/mw1024/006ax0qjly1g57m067qsfj304g04ggm1.jpg" /></span>
                <span><img class="face" src="//tva1.sinaimg.cn/mw1024/006ax0qjly1g57m06k3iaj304g04gmxg.jpg" /></span>
                <span><img class="face" src="//tva1.sinaimg.cn/mw1024/006ax0qjly1g57m06xd0fj304g04gt92.jpg" /></span>
                <span><img class="del" src="/static/img/wchat/icon__emotion-del.png" /></span>
            </div>
        </div>
        <div class="swiper-slide">
            <div class="face-list face__sm-list">
                <span><img class="face" src="//tva1.sinaimg.cn/mw1024/006ax0qjly1g57m07cu2ij304g04gt91.jpg" /></span>
                <span><img class="face" src="//tva1.sinaimg.cn/mw1024/006ax0qjly1g57m07zuzyj304g04gmxi.jpg" /></span>
                <span><img class="face" src="//tva1.sinaimg.cn/mw1024/006ax0qjly1g57m08bm52j304g04gjrq.jpg" /></span>
                <span><img class="face" src="//tva1.sinaimg.cn/mw1024/006ax0qjly1g57m08pj3kj304g04g74l.jpg" /></span>
                <span><img class="face" src="//tva1.sinaimg.cn/mw1024/006ax0qjly1g57m092u81j304g04gwev.jpg" /></span>
                <span><img class="face" src="//tva1.sinaimg.cn/mw1024/006ax0qjly1g57m09eddjj304g04gwep.jpg" /></span>
                <span><img class="face" src="//tva1.sinaimg.cn/mw1024/006ax0qjly1g57m09sooxj304g04g0t0.jpg" /></span>
                
                <span><img class="face" src="//tva1.sinaimg.cn/mw1024/006ax0qjly1g57m0a8uzsj304g04gmxj.jpg" /></span>
                <span><img class="face" src="//tva1.sinaimg.cn/mw1024/006ax0qjly1g57m0am2s5j304g04g74s.jpg" /></span>
                <span><img class="face" src="//tva1.sinaimg.cn/mw1024/006ax0qjly1g57m0azrhtj304g04gwev.jpg" /></span>
                <span><img class="face" src="//tva1.sinaimg.cn/mw1024/006ax0qjly1g57m0bcszlj304g04gwev.jpg" /></span>
                <span><img class="face" src="//tva1.sinaimg.cn/mw1024/006ax0qjly1g57m0brfhzj304g04gjro.jpg" /></span>
                <span><img class="face" src="//tva1.sinaimg.cn/mw1024/006ax0qjly1g57m0c4e22j304g04gt93.jpg" /></span>
                <span><img class="face" src="//tva1.sinaimg.cn/mw1024/006ax0qjly1g57m0civ50j304g04gglt.jpg" /></span>
                
                <span><img class="face" src="//tva1.sinaimg.cn/mw1024/006ax0qjly1g57m0cuvv9j304g04g0t1.jpg" /></span>
                <span><img class="face" src="//tva1.sinaimg.cn/mw1024/006ax0qjly1g57m0dcje7j304g04g74r.jpg" /></span>
                <span><img class="face" src="//tva1.sinaimg.cn/mw1024/006ax0qjly1g57m0dqej2j304g04gwey.jpg" /></span>
                <span><img class="face" src="//tva1.sinaimg.cn/mw1024/006ax0qjly1g57m0e48hcj304g04gjrt.jpg" /></span>
                <span><img class="face" src="//tva1.sinaimg.cn/mw1024/006ax0qjly1g57m0f6kssj304g04gwey.jpg" /></span>
                <span><img class="face" src="//tva1.sinaimg.cn/mw1024/006ax0qjly1g57m0fmmxoj304g04g3ys.jpg" /></span>
                <span><img class="del" src="/static/img/wchat/icon__emotion-del.png" /></span>
            </div>
        </div>
        <div class="swiper-slide">
            <div class="face-list face__sm-list">
                <span><img class="face" src="//tva1.sinaimg.cn/mw1024/006ax0qjly1g57m0fysw0j304g04gmxk.jpg" /></span>
                <span><img class="face" src="//tva1.sinaimg.cn/mw1024/006ax0qjly1g57m0gryijj304g04g0so.jpg" /></span>
                <span><img class="face" src="//tva1.sinaimg.cn/mw1024/006ax0qjly1g57m0h68hfj304g04gmxn.jpg" /></span>
                <span><img class="face" src="//tva1.sinaimg.cn/mw1024/006ax0qjly1g57m0hlkqij304g04gmxh.jpg" /></span>
                <span><img class="face" src="//tva1.sinaimg.cn/mw1024/006ax0qjly1g57m0i11b9j304g04gdge.jpg" /></span>
                <span><img class="face" src="//tva1.sinaimg.cn/mw1024/006ax0qjly1g57m0ir0n2j304g04gdg1.jpg" /></span>
                <span><img class="face" src="//tva1.sinaimg.cn/mw1024/006ax0qjly1g57m0je3l1j304g04gglu.jpg" /></span>
                
                <span><img class="face" src="//tva1.sinaimg.cn/mw1024/006ax0qjly1g57m0k0ya4j304g04gjrm.jpg" /></span>
                <span><img class="face" src="//tva1.sinaimg.cn/mw1024/006ax0qjly1g57m0kp0fgj304g04gdg5.jpg" /></span>
                <span><img class="face" src="//tva1.sinaimg.cn/mw1024/006ax0qjly1g57m0l6msgj304g04gmxh.jpg" /></span>
                <span><img class="face" src="//tva1.sinaimg.cn/mw1024/006ax0qjly1g57m0lkzo5j304g04gq3g.jpg" /></span>
                <span><img class="face" src="//tva1.sinaimg.cn/mw1024/006ax0qjly1g57m0m1sv0j304g04g0t5.jpg" /></span>
                <span><img class="face" src="//tva1.sinaimg.cn/mw1024/006ax0qjly1g57m0mfzepj3074074js5.jpg" /></span>
                <span><img class="face" src="//tva1.sinaimg.cn/mw1024/006ax0qjly1g57m0mtrhlj304g04gwer.jpg" /></span>
                
                <span><img class="face" src="//tva1.sinaimg.cn/mw1024/006ax0qjly1g57m0n9y2aj304g04gmxf.jpg" /></span>
                <span><img class="face" src="//tva1.sinaimg.cn/mw1024/006ax0qjly1g57m0nue2ij304g04gmxr.jpg" /></span>
                <span><img class="face" src="//tva1.sinaimg.cn/mw1024/006ax0qjly1g57m0od20oj304g04gjrl.jpg" /></span>
                <span><img class="face" src="//tva1.sinaimg.cn/mw1024/006ax0qjly1g57m0ou0oxj304g04g74n.jpg" /></span>
                <span><img class="face" src="//tva1.sinaimg.cn/mw1024/006ax0qjly1g57m0pbixnj304g04gdfs.jpg" /></span>
                <span><img class="face" src="//tva1.sinaimg.cn/mw1024/006ax0qjly1g57m0ptb85j304g04gwf2.jpg" /></span>
                <span><img class="del" src="/static/img/wchat/icon__emotion-del.png" /></span>
            </div>
        </div>
        <div class="swiper-slide">
            <div class="face-list face__sm-list">
                <span><img class="face" src="//tva1.sinaimg.cn/mw1024/006ax0qjly1g57m0qbf0wj304g04g74m.jpg" /></span>
                <span><img class="face" src="//tva1.sinaimg.cn/mw1024/006ax0qjly1g57m0qp9lwj304g04gjrr.jpg" /></span>
                <span><img class="face" src="//tva1.sinaimg.cn/mw1024/006ax0qjly1g57m0r49a7j304g04gdg9.jpg" /></span>
                <span><img class="face" src="//tva1.sinaimg.cn/mw1024/006ax0qjly1g57m0rgx9xj304g04g0t7.jpg" /></span>
                <span><img class="face" src="//tva1.sinaimg.cn/mw1024/006ax0qjly1g57m0rt02aj304g04ggm1.jpg" /></span>
                <span><img class="face" src="//tva1.sinaimg.cn/mw1024/006ax0qjly1g57m0s8c9lj304g04gwf2.jpg" /></span>
                <span><img class="face" src="//tva1.sinaimg.cn/mw1024/006ax0qjly1g57m0su6eoj304g04gjrt.jpg" /></span>
                
                <span><img class="face" src="//tva1.sinaimg.cn/mw1024/006ax0qjly1g57m0t9r48j304g04gq39.jpg" /></span>
                <span><img class="face" src="//tva1.sinaimg.cn/mw1024/006ax0qjly1g57m0tmha0j304g04g74x.jpg" /></span>
                <span><img class="face" src="//tva1.sinaimg.cn/mw1024/006ax0qjly1g57m0u1gn2j304g04g3yq.jpg" /></span>
                <span><img class="face" src="//tva1.sinaimg.cn/mw1024/006ax0qjly1g57m0uia1bj304g04gjrt.jpg" /></span>
                <span><img class="face" src="//tva1.sinaimg.cn/mw1024/006ax0qjly1g57m0uxextj304g04gwev.jpg" /></span>
                <span><img class="face" src="//tva1.sinaimg.cn/mw1024/006ax0qjly1g57m0vc2qej304g04g0t8.jpg" /></span>
                <span><img class="face" src="//tva1.sinaimg.cn/mw1024/006ax0qjly1g57m0vw5abj304g04gjs4.jpg" /></span>
                
                <span><img class="face" src="//tva1.sinaimg.cn/mw1024/006ax0qjly1g57m0wgjsnj304g04g3yx.jpg" /></span>
                <span><img class="face" src="//tva1.sinaimg.cn/mw1024/006ax0qjly1g57m0wurnsj304g04gdfy.jpg" /></span>
                <span><img class="face" src="//tva1.sinaimg.cn/mw1024/006ax0qjly1g57m0x80mjj304g04gjrn.jpg" /></span>
                <span><img class="face" src="//tva1.sinaimg.cn/mw1024/006ax0qjly1g57m0xozamj304g04gt9a.jpg" /></span>
                <span><img class="face" src="//tva1.sinaimg.cn/mw1024/006ax0qjly1g57m0y3si8j304g04gwet.jpg" /></span>
                <span><img class="face" src="//tva1.sinaimg.cn/mw1024/006ax0qjly1g57m0zioiyj304g04g3yq.jpg" /></span>
                <span><img class="del" src="/static/img/wchat/icon__emotion-del.png" /></span>
            </div>
        </div>
    </div>
    <!-- //动图1 -->
    <div class="swiper__tmpl-emotion02" style="display: none;">
        <div class="swiper-slide">
            <div class="face-list face__lg-list">
                <span><img class="lg-face" wb="#//tva1.sinaimg.cn/mw1024/006ax0qjgy1gnao115r8kg305k05p4qp.gif&" src="/static/gif/1.png" /></span>
                <span><img class="lg-face" wb="#//tva1.sinaimg.cn/mw1024/006ax0qjgy1gnao14ok4jg306i08lu0x.gif&" src="/static/gif/2.png" /></span>
                <span><img class="lg-face" wb="#//tva1.sinaimg.cn/mw1024/006ax0qjgy1gnao17nw7xg30600aou0z.gif&" src="/static/gif/3.png" /></span>
                <span><img class="lg-face" wb="#//tva1.sinaimg.cn/mw1024/006ax0qjgy1gnao1anhm6g3050069dqs.gif&" src="/static/gif/4.png" /></span>
                <span><img class="lg-face" wb="#//tva1.sinaimg.cn/mw1024/006ax0qjgy1gnao1ditipg305008thdu.gif&" src="/static/gif/5.png" /></span>
                <span><img class="lg-face" wb="#//tva1.sinaimg.cn/mw1024/006ax0qjgy1gnao24r3k9g304805ub29.gif&" src="/static/gif/6.png" /></span>
                <span><img class="lg-face" wb="#//tva1.sinaimg.cn/mw1024/006ax0qjgy1gnao225dfbg305o0a04qq.gif&" src="/static/gif/7.png" /></span>
                <span><img class="lg-face" wb="#//tva1.sinaimg.cn/mw1024/006ax0qjgy1gnapbmlh5yg306o06o7pw.gif&" src="/static/gif/8.png" /></span>
                
            </div>
        </div>
        
        <div class="swiper-slide">
            <div class="face-list face__lg-list">
                <span><img class="lg-face" wb="#//tva1.sinaimg.cn/mw1024/006ax0qjgy1gnapbpfp71g306o06okbq.gif&" src="/static/gif/9.png" /></span>
                <span><img class="lg-face" wb="#//tva1.sinaimg.cn/mw1024/006ax0qjgy1gnapbruptcg306o06owf6.gif&" src="/static/gif/10.png" /></span>
                <span><img class="lg-face" wb="#//tva1.sinaimg.cn/mw1024/006ax0qjgy1gnapbud5cjg306o06o13e.gif&" src="/static/gif/11.png" /></span>
                <span><img class="lg-face" wb="#//tva1.sinaimg.cn/mw1024/006ax0qjgy1gnapbx25rzg306o06ogt7.gif&" src="/static/gif/12.png" /></span>
                <span><img class="lg-face" wb="#//tva1.sinaimg.cn/mw1024/006ax0qjgy1gnapcgk0lcg306o06oac6.gif&" src="/static/gif/14.png" src="/static/gif/13.png" /></span>
                <span><img class="lg-face" wb="#//tva1.sinaimg.cn/mw1024/006ax0qjgy1gnapcdm53tg306o06oq8m.gif&" src="/static/gif/13.png"/></span>
                <span><img class="lg-face" wb="#//tva1.sinaimg.cn/mw1024/006ax0qjgy1gnapcaafugg306o06o0tt.gif&" src="/static/gif/15.png" /></span>
                <span><img class="lg-face" wb="#//tva1.sinaimg.cn/mw1024/006ax0qjgy1gnapu39qi3g30dc098ayt.gif&" src="/static/gif/16.png" /></span>
            </div>
        </div>
    </div>
    <!-- //动图2 -->
    <div class="swiper__tmpl-emotion03" style="display: none;">
        <div class="swiper-slide">
            <div class="face-list face__lg-list">
                <span><img class="lg-face" wb="#//tva1.sinaimg.cn/mw1024/006ax0qjgy1gnapcjtvb7j30b40b475g.jpg&" src="//tva1.sinaimg.cn/mw1024/006ax0qjgy1gnapcjtvb7j30b40b475g.jpg" /></span>
                <span><img class="lg-face" wb="#//tva1.sinaimg.cn/mw1024/006ax0qjgy1gnapcmcs4yj30b40b4gm8.jpg&" src="//tva1.sinaimg.cn/mw1024/006ax0qjgy1gnapcmcs4yj30b40b4gm8.jpg" /></span>
                <span><img class="lg-face" wb="#//tva1.sinaimg.cn/mw1024/006ax0qjgy1gnapweqa4aj30b40b4aan.jpg&" src="//tva1.sinaimg.cn/mw1024/006ax0qjgy1gnapweqa4aj30b40b4aan.jpg" /></span>
                <span><img class="lg-face" wb="#//tva1.sinaimg.cn/mw1024/006ax0qjgy1gnapwot4zvj30b40b4t9t.jpg&" src="//tva1.sinaimg.cn/mw1024/006ax0qjgy1gnapwot4zvj30b40b4t9t.jpg" /></span>
                <span><img class="lg-face" wb="#//tva1.sinaimg.cn/mw1024/006ax0qjgy1gnapwot4zvj30b40b4t9t.jpg&" src="//tva1.sinaimg.cn/mw1024/006ax0qjgy1gnapwot4zvj30b40b4t9t.jpg" /></span>
                <span><img class="lg-face"  wb="#//tva1.sinaimg.cn/mw1024/006ax0qjgy1gnapwxwrecj30b40b4gmm.jpg&" src="//tva1.sinaimg.cn/mw1024/006ax0qjgy1gnapwxwrecj30b40b4gmm.jpg" /></span>
                <span><img class="lg-face" wb="#//tva1.sinaimg.cn/mw1024/006ax0qjgy1gnapx0wk8mj30b40b474q.jpg&" src="//tva1.sinaimg.cn/mw1024/006ax0qjgy1gnapx0wk8mj30b40b474q.jpg" /></span>
                <span><img class="lg-face" wb="#//tva1.sinaimg.cn/mw1024/006ax0qjgy1gnapx3k1sfj30b40b4js5.jpg&" src="//tva1.sinaimg.cn/mw1024/006ax0qjgy1gnapx3k1sfj30b40b4js5.jpg" /></span>
                
                
            </div>
        </div>
        <div class="swiper-slide">
            <div class="face-list face__lg-list">
            <span><img class="lg-face" wb="#//tva1.sinaimg.cn/mw1024/006ax0qjgy1gnapxmwfruj30b40b4wf1.jpg&" src="//tva1.sinaimg.cn/mw1024/006ax0qjgy1gnapxmwfruj30b40b4wf1.jpg" /></span>
            <span><img class="lg-face" wb="#//tva1.sinaimg.cn/mw1024/006ax0qjgy1gnapxs39qmj30b40b4jsd.jpg&" src="//tva1.sinaimg.cn/mw1024/006ax0qjgy1gnapxs39qmj30b40b4jsd.jpg" /></span>
            <span><img class="lg-face" wb="#//tva1.sinaimg.cn/mw1024/006ax0qjgy1gnapxuqlvij30b40b4wfk.jpg&" src="//tva1.sinaimg.cn/mw1024/006ax0qjgy1gnapxuqlvij30b40b4wfk.jpg" /></span>
            <span><img class="lg-face" wb="#//tva1.sinaimg.cn/mw1024/006ax0qjgy1gnapy1ohv1j30b40b4my7.jpg&" src="//tva1.sinaimg.cn/mw1024/006ax0qjgy1gnapy1ohv1j30b40b4my7.jpg" /></span>
            <span><img class="lg-face" wb="#//tva1.sinaimg.cn/mw1024/006ax0qjgy1gnapyedb5pj30b40b4jse.jpg&" src="//tva1.sinaimg.cn/mw1024/006ax0qjgy1gnapyedb5pj30b40b4jse.jpg" /></span>
            <span><img class="lg-face" wb="#//tva1.sinaimg.cn/mw1024/006ax0qjgy1gnapygxv6uj30b40b4dgr.jpg&" src="//tva1.sinaimg.cn/mw1024/006ax0qjgy1gnapygxv6uj30b40b4dgr.jpg" /></span>
            <span><img class="lg-face" wb="#//tva1.sinaimg.cn/mw1024/006ax0qjgy1gnapz0feyyj30b40b4wfa.jpg&" src="//tva1.sinaimg.cn/mw1024/006ax0qjgy1gnapz0feyyj30b40b4wfa.jpg" /></span>
            <span><img class="lg-face" wb="#//tva1.sinaimg.cn/mw1024/006ax0qjgy1gnapz3jnbyj30b40b4gmb.jpg&" src="//tva1.sinaimg.cn/mw1024/006ax0qjgy1gnapz3jnbyj30b40b4gmb.jpg" /></span>
            </div>
        </div>
    </div>
    <!-- //动图3
    <div class="swiper__tmpl-emotion04" style="display: none;">
        <div class="swiper-slide">
            <div class="face-list face__lg-list">
                <span><img class="lg-face" src="//tva1.sinaimg.cn/mw1024/006ax0qjly1g57llsxp2wg306o06omy6.gif" /></span>
                <span><img class="lg-face" src="//tva1.sinaimg.cn/mw1024/006ax0qjly1g57llteepog306o06ojt1.gif" /></span>
                <span><img class="lg-face" src="//tva1.sinaimg.cn/mw1024/006ax0qjly1g57llu3fo7g306o06odi0.gif" /></span>
                <span><img class="lg-face" src="//tva1.sinaimg.cn/mw1024/006ax0qjly1g57lluybn5g306o06oaa6.gif" /></span>

                <span><img class="lg-face" src="//tva1.sinaimg.cn/mw1024/006ax0qjly1g57llvt5dxg306o06o40x.gif" /></span>
                <span><img class="lg-face" src="//tva1.sinaimg.cn/mw1024/006ax0qjly1g57llw3w9gg306o06odg9.gif" /></span>
                <span><img class="lg-face" src="//tva1.sinaimg.cn/mw1024/006ax0qjly1g57llwqce9g306o06o402.gif" /></span>
                <span><img class="lg-face" src="//tva1.sinaimg.cn/mw1024/006ax0qjly1g57llx6cxlg306o06ojro.gif" /></span>
            </div>
        </div>
        <div class="swiper-slide">
            <div class="face-list face__lg-list">
                <span><img class="lg-face" src="//tva1.sinaimg.cn/mw1024/006ax0qjly1g57llxonqkg306o06oq5c.gif" /></span>
                <span><img class="lg-face" src="//tva1.sinaimg.cn/mw1024/006ax0qjly1g57lly2a6ng306o06o0u9.gif" /></span>
                <span><img class="lg-face" src="//tva1.sinaimg.cn/mw1024/006ax0qjly1g57llyurc8g306o06odhc.gif" /></span>
                <span><img class="lg-face" src="//tva1.sinaimg.cn/mw1024/006ax0qjly1g57llz78kng306o06owfc.gif" /></span>
                
                <span><img class="lg-face" src="//tva1.sinaimg.cn/mw1024/006ax0qjly1g57llzpqlwg306o06o0v5.gif" /></span>
                <span><img class="lg-face" src="//tva1.sinaimg.cn/mw1024/006ax0qjly1g57lm08k4ug306o06omzk.gif" /></span>
                <span><img class="lg-face" src="//tva1.sinaimg.cn/mw1024/006ax0qjly1g57lm0pe1bg306o06o0u5.gif" /></span>
                <span><img class="lg-face" src="//tva1.sinaimg.cn/mw1024/006ax0qjly1g57lm2db0yg306o06o76b.gif" /></span>
            </div>
        </div>
    </div>
    <!-- //动图4 
    <div class="swiper__tmpl-emotion05" style="display: none;">
        <div class="swiper-slide">
            <div class="face-list face__lg-list">
                <span><img class="lg-face" src="//tva1.sinaimg.cn/mw1024/006ax0qjly1g57lpzb2bzg306o06ojsx.gif" /></span>
                <span><img class="lg-face" src="//tva1.sinaimg.cn/mw1024/006ax0qjly1g57lpzubyeg306o06ot9r.gif" /></span>
                <span><img class="lg-face" src="//tva1.sinaimg.cn/mw1024/006ax0qjly1g57lq0c4j8g306o06o408.gif" /></span>
                <span><img class="lg-face" src="//tva1.sinaimg.cn/mw1024/006ax0qjly1g57lq0s9sgg306o06otc2.gif" /></span>

                <span><img class="lg-face" src="//tva1.sinaimg.cn/mw1024/006ax0qjly1g57lq1ghymg306o06o759.gif" /></span>
                <span><img class="lg-face" src="//tva1.sinaimg.cn/mw1024/006ax0qjly1g57lq1trezg306o06o40m.gif" /></span>
                <span><img class="lg-face" src="//tva1.sinaimg.cn/mw1024/006ax0qjly1g57lq2659cg306o06odhh.gif" /></span>
                <span><img class="lg-face" src="//tva1.sinaimg.cn/mw1024/006ax0qjly1g57lq2im1tg306o06oaca.gif" /></span>
            </div>
        </div>
        <div class="swiper-slide">
            <div class="face-list face__lg-list">
                <span><img class="lg-face" src="//tva1.sinaimg.cn/mw1024/006ax0qjly1g57lq36y3og306o06on0y.gif" /></span>
                <span><img class="lg-face" src="//tva1.sinaimg.cn/mw1024/006ax0qjly1g57lq3lok9g306o06odgy.gif" /></span>
                <span><img class="lg-face" src="//tva1.sinaimg.cn/mw1024/006ax0qjly1g57lq46wprg306o06otb4.gif" /></span>
                <span><img class="lg-face" src="//tva1.sinaimg.cn/mw1024/006ax0qjly1g57lq4pjvwg306o06oq5z.gif" /></span>
                
                <span><img class="lg-face" src="//tva1.sinaimg.cn/mw1024/006ax0qjly1g57lq52t3hg306o06otae.gif" /></span>
                <span><img class="lg-face" src="//tva1.sinaimg.cn/mw1024/006ax0qjly1g57lq5hukng306o06odgq.gif" /></span>
                <span><img class="lg-face" src="//tva1.sinaimg.cn/mw1024/006ax0qjly1g57lq5yqdpg306o06oaci.gif" /></span>
                <span><img class="lg-face" src="//tva1.sinaimg.cn/mw1024/006ax0qjly1g57lq6kykgg306o06oaay.gif" /></span>
            </div>
        </div>
    </div>
    <!-- //动图4 
    <div class="swiper__tmpl-emotion06" style="display: none;">
        <div class="swiper-slide">
            <div class="face-list face__lg-list">
                <span><img class="lg-face" src="//tva1.sinaimg.cn/mw1024/006ax0qjly1g57luoiplsg306o06o40c.gif" /></span>
                <span><img class="lg-face" src="//tva1.sinaimg.cn/mw1024/006ax0qjly1g57lup6v39g306o06ogls.gif" /></span>
                <span><img class="lg-face" src="//tva1.sinaimg.cn/mw1024/006ax0qjly1g57lupnx5ng306o06ojtt.gif" /></span>
                <span><img class="lg-face" src="//tva1.sinaimg.cn/mw1024/006ax0qjly1g57luq620wg306o06oq4k.gif" /></span>

                <span><img class="lg-face" src="//tva1.sinaimg.cn/mw1024/006ax0qjly1g57luqskoig306o06oabz.gif" /></span>
                <span><img class="lg-face" src="//tva1.sinaimg.cn/mw1024/006ax0qjly1g57lur9eqag306o06owgm.gif" /></span>
                <span><img class="lg-face" src="//tva1.sinaimg.cn/mw1024/006ax0qjly1g57lurng9zg306o06ojsn.gif" /></span>
                <span><img class="lg-face" src="//tva1.sinaimg.cn/mw1024/006ax0qjly1g57lut84c6g306o06odhh.gif" /></span>
            </div>
        </div>
        <div class="swiper-slide">
            <div class="face-list face__lg-list">
                <span><img class="lg-face" src="//tva1.sinaimg.cn/mw1024/006ax0qjly1g57lutpge2g306o06o0ul.gif" /></span>
                <span><img class="lg-face" src="//tva1.sinaimg.cn/mw1024/006ax0qjly1g57luu453vg306o06o405.gif" /></span>
                <span><img class="lg-face" src="//tva1.sinaimg.cn/mw1024/006ax0qjly1g57luulzhug306o06owgq.gif" /></span>
                <span><img class="lg-face" src="//tva1.sinaimg.cn/mw1024/006ax0qjly1g57luv3nrig306o06omzk.gif" /></span>
                
                <span><img class="lg-face" src="//tva1.sinaimg.cn/mw1024/006ax0qjly1g57luvjsswg306o06ojsf.gif" /></span>
                <span><img class="lg-face" src="//tva1.sinaimg.cn/mw1024/006ax0qjly1g57luw1bkzg306o06ojti.gif" /></span>
                <span><img class="lg-face" src="//tva1.sinaimg.cn/mw1024/006ax0qjly1g57luwetveg306o06o3zp.gif" /></span>
                <span><img class="lg-face" src="//tva1.sinaimg.cn/mw1024/006ax0qjly1g57lux1siog306o06oq59.gif" /></span>
            </div>
        </div>-->


















    </div>
    <script type="text/javascript">
        var emotionSwiper;
        function setEmotionSwiper(tmpl){
            var _tmpl = tmpl ? tmpl : $("#J__emotionFootTab ul li.cur").attr("tmpl");
            $("#J__swiperEmotion .swiper-container").attr("id", _tmpl);
            $("#J__swiperEmotion .swiper-wrapper").html($("." + _tmpl).html());

            emotionSwiper = new Swiper('#' + _tmpl, {
                pagination: '.pagination-emotion',
                paginationClickable: true
            });
        }
        // 点击切换表情
        $("#J__emotionFootTab").on("click", "ul li.swiperTmpl", function(){
            // 先销毁swiper
            emotionSwiper && emotionSwiper.destroy(true, true);
            var _tmpl = $(this).attr("tmpl");
            $(this).addClass("cur").siblings().removeClass("cur");

            setEmotionSwiper(_tmpl);
        });
    </script>
    <!-- …… 表情模板.End -->

    <!-- …… .Start -->
    <div class="wc__choosePanel-tmpl">
        <!-- //红包模板.begin -->
        <!--<div class="popui__modal-mask" style="z-index:10000"></div>-->
        <div class="popui__panel-main" style="z-index:10001" id="Hongbao2">                     
        <div class="popui__panel-section"  >                            
<div class="popui__panel-child anim-scaleIn popui__ios" style="background-color: #e35449;max-width: 320px;width: 90%;">
        <div  id="J__popupTmpl-Hongbao" style="display:none;">
            <div class="wc__popupTmpl tmpl-hongbao">
                <i class="wc-xclose"></i>
                <form action=""  method="POST" accept-charset="utf-8" >
                <!--id="form" id="tripsignup"-->
                <ul class="clearfix">
                    <li class="item flexbox">
                        <label class="txt">总金额</label>
                        <input class="ipt-txt flex1" type="text" id="hbAmount" value="" name="hbAmount" placeholder="0.00" oninput="OnInput (event)" onpropertychange="OnPropChanged (event)"/><em class="unit">元</em>
                    </li>
                    <li class="item flexbox">
                        <label class="txt">红包个数</label><input class="ipt-txt flex1" type="text" name="hbNum" id="hbNum" value="" placeholder="填写个数" /><em class="unit">个</em>
                    </li>
                  <li class="item flexbox">
                        <label class="txt">红包模式</label><!--<input class="ipt-txt align-l flex1" type="text" name="hbtype"  id="hbtype" placeholder="手气红包" readonly />-->
                    &nbsp;&nbsp;&nbsp;&nbsp;<input class="ipt-txt1 flex11" name="hbtype" class="radio_type" type="radio" value="0" checked="checked"/>拼手气&nbsp;<input class="ipt-txt1 flex11" name="hbtype" class="radio_type" type="radio" value="1" />平均分配</li>
                    <!--<li class="tips">在线人数共<em class="memNum">186</em>人</li>-->
                    <li class="item item-area">
                        <textarea class="describe" name="content" value="" id="content" placeholder="恭喜发财，大吉大利">恭喜发财，大吉大利</textarea>
                    </li>
                    <li class="amountTotal">￥<em class="num" id="ssnum">0.00</em></li>
                    </form>
                    <div id="post2" class="popui__panel-btn"><span class="btn" data-index="0" style="background:#ddbe84;color:#fff;font-size:16px;">塞钱进红包</span></div>
                </ul>
            </div>
            </div>
            </div>
            </div>
            </div>
        </div>
    
        <!--红包模板-->

        <!-- //红包点击模板 -->
        <!--<div class="popui__modal-mask" style="z-index:10000"></div>-->
        <div class="popui__panel-main" style="z-index:10001" id="Hongbao3">                     
        <div class="popui__panel-section"  >                            
<div class="popui__panel-child anim-scaleIn popui__ios" style="background-color: #e35449;max-width: 320px;width: 90%;">
        <div  id="J__popupTmpl-Hongbao2" style="display:none;">
            <div class="wc__popupTmpl tmpl-hongbao">
                <i class="wc-xclose"></i>
                <div class="north">
            <div class="avatar">
                <div class="avatar-wrap">
                    <img id ="ximg" ng-src="/static/img/uimg/u__chat-img10.jpg" src="/static/img/uimg/u__chat-img10.jpg">
                </div>
            </div>
            <div class="nickName">
                <span class="ng-binding" id="rednickname">Suunto不急不急</span>
            </div>
            <div class="hint">发送了一个红包</div>
            <div class="msg ng-binding-n" id="redcontent">恭喜发财，大吉大利</div>
            </div>
            <div class="chai" id="chai" >
            <div class="chai-border">
                <span class="kai">開</span>
            </div>
        </div>
        </div>  
            </div>
            </div>
            </div>
            </div>
            </div>
        </div>
        <!--红包点击模板结束-->
                            <!--到结束-->

        <style type="text/css">
            .wc__popup-topbar{position:relative; display:none;}
.wrap__topbar-mask{background:rgba(100,100,100,0); height: 100%; width: 100%; position:fixed; left:0; top: 0; z-index: 2008;}
.wrap__topbar-menu{max-width:750px;width:100%;position: fixed;top: 0.9rem;z-index:2008;}
.wrap__topbar-menu ul{background:#fff;border-radius:.03rem;box-shadow:0 .05rem .2rem rgba(0,0,0,.2);position:absolute;right:.1rem;width: 100%;
    height: 100px;}
.wrap__topbar-menu ul li{color:#666; font-size:.28rem; font-family:"Microsoft Yahei"; padding:.3rem; position:relative;}
.wrap__topbar-menu ul li:after{content: ''; background-color: #e2e2e2; color: #e2e2e2; height: 1px; position: absolute; left: .2rem; right: .2rem; bottom: 0; transform: scaleY(0.5); -webkit-transform: scaleY(0.5);}
.wrap__topbar-menu ul li:last-child:after{display: none;}
.wrap__topbar-menu ul li .ico{display: inline-block; vertical-align: top; margin-right:.2rem; height: .48rem; width: .48rem; position: relative;}
.wrap__topbar-menu ul li .ico.i1{background: url(../img/topbar/icon__qun-chat.png) no-repeat center; background-size: .48rem;}
.wrap__topbar-menu ul li .ico.i2{background: url(../img/topbar/icon__add-friend.png) no-repeat center; background-size: .48rem;}
.wrap__topbar-menu ul li .ico.i3{background: url(../img/topbar/icon__help.png) no-repeat -.02rem center; background-size: .48rem;}


        </style>


        <!--外部视频播放-

        <div class="wc__popup-topbar" id="J__popupTopBar" style="display: block;">
        <div class="wrap__topbar-mask"></div>
        <div class="wrap__topbar-menu">
            <ul class="clearfix animated anim-zoomInDownSmall">
            我是一个视频
            </ul>
        </div>
    </div>
        <!--end-->


        <script type="text/javascript">

        /* ...红包事件.start 
        $(".J__wchatHb").on("click", function(){
        
        
        });
        */




        <!--

// Firefox, Google Chrome, Opera, Safari, Internet Explorer from version 9
          function OnInput (event) {
             $("#ssnum").html(event.target.value);
          }
      // Internet Explorer
          function OnPropChanged (event) {
              if (event.propertyName.toLowerCase () == "value") {
                alert ("The new content: " + event.srcElement.value);
             }
         }
        //-->
        </script>
    
        <style>
.shake-chunk{
    animation: rotate 2s linear infinite;
}


@keyframes rotate{from{transform: rotate(0deg)}
    to{
    transform: rotateY(359deg);
    }
}
</style>
<script type="text/javascript">
$(function(){
    

    $("#post2").on("click", function(){
    //检测数据是否正常
    /**
        alert($("#hbAmount").val());
        alert($("#hbNum").val());
        alert($("#content").val());
        **/
        if(!$("#hbAmount").val()){
            Tmsg('填写红包金额',2);
            return false; 
        }
        if(!$("#hbNum").val()){
            Tmsg('填写分配人数',2);
            return false; 
        }
        $("#J__popupTmpl-Hongbao").hide();

         $.post("/message/index/groupredpacket",
    {
      hbAmount:$("#hbAmount").val(),
      fid:ljc_fid,
      hbNum:$("#hbNum").val(),
      hbtype:$("input[name='hbtype']:checked").val(),
      content:$("#content").val(),
    },
    function(data,status){
        if(data==1){
            Tmsg('土豪~红包发送成功',3);
        }else if(data==2){
            Tmsg('您设置的金额不够分配请减少分配人数或提高金额',3);
        }else{
            Tmsg('余额不足请联系客服充值',3);
        }
        //document.getElementById("user").innerHTML=data;
        
    });
    
    });
    
    
    //关闭红包
    $(".wc-xclose").on("click", function(){
        $("#J__popupTmpl-Hongbao").hide();
        $("#J__popupTmpl-Hongbao2").hide();
    //  $(".wc__choose-panel").show();
        });
  //检测声音状态
   var music = $.cookie('laba');
   if(music==0){
    $('#laba').attr('class','laba2'); 
    mutePage()
  }
   
});
var chai = 1;
function hbchai(id,chatid){
    if(chai==0){
        chai=1;
        $.post("/message/index/redpacket",
     {
         fid:ljc_fid,
         id:id,
         chatid:chatid
    },
    function(data,status){
          audioAutoPlay('hbmusic');//红包声音
          $('.chai').addClass('shake-chunk');
        
    setTimeout(function () {
        $("#J__popupTmpl-Hongbao").hide();
        $("#J__popupTmpl-Hongbao2").hide();
     window.location.href="/index/index/hbinfo?id="+data;
   },500);
   
    });
    
    }
    }

function hbkq(id,chatid){
    chai = 0;
    //console.log('点开红包');
    $.post("/message/index/redpacketinfo",
    {
      fid:ljc_fid,
      id:id,
     
    },
    function(data,status){
        var obj = JSON.parse(data); 
        //console.log(obj);

        //console.log(obj.redid);

        if(obj.redid > 0){
            window.location.href="/index/index/hbinfo?id="+obj.redid;
            return false;
            }

        if(obj.num==0){
            window.location.href="/index/index/hbinfo?redid="+obj.id;
            return false;
       }
      
       

         $("#ximg").attr("src",obj.tx); 
         $('#rednickname').html(obj.name);
         chaihtml='<div class="chai-border" ><a onclick="hbchai('+obj.id+','+chatid+');"><span class="kai">開</span></a></div>';
         $('#chai').html(chaihtml);
         $('#redcontent').html(obj.content); 
        //打开红包点击模板
        $("#Hongbao3").show();
        $("#J__popupTmpl-Hongbao2").show();
        $(".wc__choose-panel").hide();
    });
    }
 
</script>
    
<script type="text/javascript">
<!--
var ljc_name="赫连灯摘";
var ljc_tx="/tximg/tx.jpg#175#406";
var ljc_id="1847";
var ljc_fid="9";
var page="1";
    //头像上传
        function uploadPictx(formData) {
            var oReq = new XMLHttpRequest();
            oReq.open("POST", "/message/index/grouppic?id=1847&fid=9&zt=0", true);
            oReq.onload = function (oEvent) {
                if (oReq.status == 200) {
                    //msgWrapper.innerHTML += oReq.response;
                    //$('#msgWrapper').scrollTop( $('#msgWrapper')[0].scrollHeight );//滚动条至底部
                    //消息回调
                    if(oReq.response=="s1"){
                        Tmsg('聊天室当前禁言不能发言',3);
                        return false;
                    }else if(oReq.response=="s2"){
                        Tmsg('您已经被踢出此聊天室',3);
                        window.location.href = '/';
                        return false;
                    }else{
                        Tmsg('上传成功',2);
                    }
                    html=oReq.response;
                console.log(html);
                //  $('#shopimgdata').html(html);

                    // $('#uptpzt').html(html);

                } else {
                    //msgWrapper.innerHTML += '';
                    //document.getElementById("msgWrapper").innerHTML=oReq.status;

                }
            };

            oReq.send(formData);
        }


//用户头像上传
    $("#idzfilezt").change(function(){
    //console.log('头像主图');
    lrz(this.files[0],{width:800})
    .then(function (rst) {
        // 处理成功会执行
        //$('#shopimgdata').html('<img src="/Public/images/dd.gif">');
        //Toast('图片已经提交请耐心等待',5500)
        
        var img = new Image();
        img.src = rst.base64;
        var type;
        type = 'idzfile2';
        //console.log(img.src);
        uploadPictx(img.src);
       // up_ajax(rst.base64,type);

    });
});

    $("#photoFile").change(function(){
    //console.log('主图');
    lrz(this.files[0],{width:800})
    .then(function (rst) {
        // 处理成功会执行
        Toast('图片已经提交请耐心等待',5500)
        var img = new Image();
        img.src = rst.base64;
        var type;
        type = 'idzfile2';
        //console.log(img.src);
        uploadPic(img.src);
       // up_ajax(rst.base64,type);

    });
});
refresh_fuc();
//群消息
 function refresh_fuc(){  
     //return;
     $.post("/message/index/groupmessage",
    {
      fid:ljc_fid,//群组ID
      userid:ljc_id,//用户ID
      zt:"0"//状态
    },
    function(data,status){
        data1=eval(data);
        // console.log(data1);
      // playVid2();
        if(data1[data1.length-1].ts<10 && ljc_id != data1[data1.length-1].userid){
       //   console.log('播放');
        playVid2();
        }
    
        initTable(data);
        //$('#msgWrapper').scrollTop( $('#msgWrapper')[0].scrollHeight );//滚动条至底部
    });
 }

setInterval(refresh_fuc, 4000); //刷新频率   

//群主权限
var qz = "0";
var gdzt =1;
//处理json
 function initTable (data) {
        data1=data=eval(data);
        if(data1[data1.length-1].ts<10 && ljc_id != data1[data1.length-1].userid){
          gdzt=1;
        }
        var html = '';
        for (var j in data) {
            var obj = data[j];
            //是否群主
            if(obj.rank==1){
            obj.name=""+obj.name+"<font color=\"red\">[群主]</font>";
            }
            //console.log(obj.id);
            if(obj.userid==ljc_id){
                if(obj.type=="1") {
                    var type="picture";
                    }else{
                        var type="";
                    }
                html +='<li class="me">\
                <div class="content">\
                                <p class="author"><a href="/index/index/fdinfo.html?id=' + obj.userid + '">' + obj.name + '</a> <font color="red"><a onclick="userch('+obj.id+');">撤回</a></font></p>\
                                <div class="msg ' + type + '" id="picbig">\
                                    ' + obj.content + '\
                                </div>\
                            </div>\
                            <a class="avatar"><img src="' + obj.tx + '" /></a>\
                        </li>';
                }else if(obj.userid == '0'){
                    html +=obj.content
                }else{
                if(obj.type=="1") {
                    var type="picture";
                    }else{
                        var type="";
                    }
                    if(qz==1){
                        htmlqz=' <font color="red"><a onclick="userjl('+obj.userid+');">删除记录</a> <a onclick="usertc('+obj.userid+');">踢出</a></font>';
                    }else{
                        htmlqz='';
                    }
                html +='<li class="others">\
                            <a class="avatar"><img src="' + obj.tx + '" /></a>\
                            <div class="content">\
                                <p class="author"><a href="/index/index/fdinfo.html?id=' + obj.userid + '"><span class="slt">' + obj.name + '</span></a>' + htmlqz + '</p>\
                                <div class="msg ' + type + '" id="picbig">\
                                    ' + obj.content + '\
                                </div>\
                            </div>\
                        </li>';
            }
        }
        //console.log(html);
        $('#J__chatMsgList').html(html);
        //滚动到底部
        if(gdzt==1){
            $(".wc__chatMsg-panel").animate({scrollTop: $("#pagecount2020").height()}, 0);
        //$(".wc__chatMsg-panel").animate({scrollTop: $("#J__chatMsgList").height()}, 0);
        gdzt=0;
        }

    }
//禁言和删除记录
function usertc(id){
    if (!confirm('确定将该用户踢出群组吗？')) return false;
    console.log(id);
     $.post("/member/index/grouplogout",
    {
      id:id,
      fid:ljc_fid,
    },
    function(data,status){
        if(data==1){
            Tmsg('已将该用户踢出群组,用户将无法发言及进入本群组',3);
        }
        //document.getElementById("user").innerHTML=data;
    });
}
function userjl(id){
    if (!confirm('确定删除该用户所有聊天记录吗?')) return false;

    console.log(id);
     $.post("/member/index/groupuserxx",
    {
      id:id,//postQQ号码
      fid:ljc_fid,
    },
    function(data,status){
        if(data==1){
            Tmsg('已删除该用户所有聊天记录',1);
        }
        //document.getElementById("user").innerHTML=data;
    });
}

function userch(id){
    if (!confirm('确定撤回该消息？')) return false;

    console.log(id);
     $.post("/message/index/groupch",
    {
      id:id,//postQQ号码
      fid:ljc_fid,
    },
    function(data,status){
        if(data==1){
            Tmsg('已撤回消息',1);
        }
        //document.getElementById("user").innerHTML=data;
    });
}


function Tmsg(msg,time){
     wcPop({
      anim: 'fadeIn',
      content: msg,
      shade: true,
      shadeClose: false,
      time: time
    });

        
}

//-->
</script>
<script type="text/javascript">
$(function(){
   var music = $.cookie('laba');
   if(music==0){
    $('#laba').attr('class','laba2'); 
    mutePage()
  }

  $(".u-sx").on("click", function(e){
            window.location.reload();
          });



var countpage =0;
  $("#page").on("click", function(){
        console.log("page");
        countpage = countpage+1;
        if(page>countpage){
        //var pagehtml='<li class="time"><span>成功加载</span></li>';
        //加载聊天记录
         $.post("/message/index/grouplog",
         {
             page:countpage,
             fid:ljc_fid,
         },
         function(data,status){
             initTablelog(data,countpage);
          });

        }else{
            Tmsg('已加载所有消息',3);
                        return false;
            }
        
    //  $("#page_list").append(pagehtml);
      });
});



//处理json
 function initTablelog (data,countpage) {
        data1=data=eval(data);
        var html = '';
        for (var j in data) {
            var obj = data[j];
            //是否群主
            if(obj.rank==1){
            obj.name=""+obj.name+"<font color=\"red\">[群主]</font>";
            }
            //console.log(obj.id);
            if(obj.userid==ljc_id){
                if(obj.type=="1") {
                    var type="picture";
                    }else{
                        var type="";
                    }
                html +='<li class="me">\
                <div class="content">\
                                <p class="author"><a href="/index/index/fdinfo.html?id=' + obj.userid + '">' + obj.name + '</a></p>\
                                <div class="msg ' + type + '" id="picbig">\
                                    ' + obj.content + '\
                                </div>\
                            </div>\
                            <a class="avatar"><img src="' + obj.tx + '" /></a>\
                        </li>';
            }else if(obj.userid == '0'){
                    html +=obj.content
                }else{
                if(obj.type=="1") {
                    var type="picture";
                    }else{
                        var type="";
                    }
                    if(qz==1){
                        htmlqz=' <font color="red"><a onclick="userjl('+obj.userid+');">删除记录</a> <a onclick="usertc('+obj.userid+');">踢出</a></font>';
                    }else{
                        htmlqz='';
                    }
                html +='<li class="others">\
                            <a class="avatar"><img src="' + obj.tx + '" /></a>\
                            <div class="content">\
                                <p class="author"><a href="/index/index/fdinfo.html?id=' + obj.userid + '"><span class="slt">' + obj.name + '</span></a>' + htmlqz + '</p>\
                                <div class="msg ' + type + '" id="picbig">\
                                    ' + obj.content + '\
                                </div>\
                            </div>\
                        </li>';
            }
        }
        
        Tmsg('加载'+data1.length+'条历史消息',1);
        html +='<li class="notice" id="test'+page+'"><span>以上为历史消息</span></li>';
        if(data1.length<50){
            $('#page').hide();
            }
            //;pagecoutlist
        console.log(countpage)
        $('#page_list_'+countpage+'').append(html);
        $(".wc__chatMsg-panel").animate({scrollTop: $('#page_list_'+countpage+'').height()-100}, 0);
    }
</script>
<script type="text/javascript">
        var curIndex = 0, imgPreviewSwiper;
        $("#J__chatMsgList li").on("click", "#picbig", function(){
            var html = "",  _src = $(this).find("img").attr("src");

            $("#J__chatMsgList li .picture").each(function(i, item){
                html += '<div class="swiper-slide"><div class="swiper-zoom-container">'+ $(this).html() +'</div></div>';
                if($(this).find("img").attr("src") == _src){
                    curIndex = i;
                }
            });
            $(".J__swiperImgPreview .swiper-wrapper").html(html);
            $(".wc__popup-imgPreview").show();

            imgPreviewSwiper = new Swiper('.J__swiperImgPreview',{
                pagination: false,
                paginationClickable: true,
                zoom: true,
                observer: true,
                observeParents: true,
                initialSlide: curIndex
            });
        });
        // 关闭预览
        $(".wc__popup-imgPreview").on("click", function(e){
            var that = $(this);
            imgPreviewSwiper.destroy(true, true);
            $(".J__swiperImgPreview .swiper-wrapper").html('');
            that.hide();
        });
  
  
   function laba(){
   var laba = $('#laba').attr('class'); 
    if(laba =='laba'){
       $('#laba').attr('class','laba2'); 
       $.cookie('laba', '0', { expires: 7 });
       mutePage()
    }else{
      $('#laba').attr('class','laba'); 
      $.cookie('laba', '1', { expires: 7 });
      mutePageno()
    }
  }
   
 
// Mute a singular HTML5 element
function muteMe(elem) {
    elem.muted = true;
    elem.pause();
}

// Try to mute all video and audio elements on the page
function mutePage() {
    var videos = document.querySelectorAll("video"),
        audios = document.querySelectorAll("audio");

    [].forEach.call(videos, function(video) { muteMe(video); });
    [].forEach.call(audios, function(audio) { muteMe(audio); });
}
  
  // Mute a singular HTML5 element
function muteMeno(elem) {
    elem.muted = false;
    elem.pause();
}

// Try to mute all video and audio elements on the page
function mutePageno() {
    var videos = document.querySelectorAll("video"),
        audios = document.querySelectorAll("audio");

    [].forEach.call(videos, function(video) { muteMeno(video); });
    [].forEach.call(audios, function(audio) { muteMeno(audio); });
}
    </script>
<audio src="/cashrecivedrevised.mp3" id="hbmusic" class="media-audio" style="display:none;" crossOrigin = "Anonymous"></audio>
<audio src="/strong_notification.mp3" id="Jaudio" class="media-audio" style="display:none;" crossOrigin = "Anonymous"></audio>

<div src="" id="playaudio" class="media-audio" style="display:none;" crossOrigin = "Anonymous"></div>
<script type="text/javascript">
  function audioAutoPlay(id){
    var audio = document.getElementById(id),
        play = function(){
            audio.play();
    document.removeEventListener("touchstart",play, false);
        };
    audio.play();
    document.addEventListener("WeixinJSBridgeReady", function () {
        play();
    }, false);
    document.addEventListener('YixinJSBridgeReady', function() {
        play();
    }, false);
    document.addEventListener("touchstart",play, false);
  
  
}
                   function playVid2() {
                       audioAutoPlay('Jaudio');

                   }
                    
  
    </script>

<script type="text/javascript">
    <!--
        document.onkeydown=function(event){
            var e = event || window.event || arguments.callee.caller.arguments[0];
      //keyCode==13 shiftKey==1 37方向箭头
             if(e && e.keyCode==13){ // enter 键
                var editor = $(".J__wcEditor").html();
                console.log(editor.length);
                if(editor.length == 11) return;
//|&
                var html = editor;
                console.log(html);
                var reg =/(http:\/\/|https:\/\/)((\w|=|\?|\.|\/|\&|-|\;|\:)+)/g;
                //var reg = /(http:\/\/|https:\/\/)((\w|=|\?|\.|\/|-)+)/g;
                html = html.replace(reg, "<a href='$1$2'>$1$2</a>");
                console.log(html);
                //记录消息
                $.post("/message/index/group", { id: ljc_id, content: html,fid:ljc_fid },
                function(data){
                    //消息回调
                    if(data=="s1"){
                        Tmsg('聊天室当前禁言不能发言',3);
                        return false;
                    }else if(data=="s2"){
                        Tmsg('您已经被踢出此聊天室',3);
                        window.location.href = '/';
                        return false;
                    }
                    });
                var msgTpl = [
                    '<li class="me">\
                        <div class="content">\
                            <p class="author">'+ ljc_name +'</p>\
                            <div class="msg">'+ html +'</div>\
                        </div>\
                        <a class="avatar" href="/index/index/fdinfo"><img src="'+ ljc_tx +'" /></a>\
                    </li>'
                ].join("");
                $("#J__chatMsgList").append(msgTpl);
                //$(".editor").html("").focus().trigger("click");
                // 清空聊天框并获取焦点（处理输入法和表情 - 聚焦）
            
                if(!$(".wc__choose-panel").is(":hidden")){
                    $(".J__wcEditor").html("<p><br></p>");
                }else{
                    //$(".J__wcEditor").html("<p</p>");
                    $(".J__wcEditor").html("<p><br></p>").focus().trigger("click");
                }
                
                $(".wc__chatMsg-panel").animate({scrollTop: $("#J__chatMsgList").height()}, 0);
                //End
             }
};

$(".editor").bind("input propertychange change",function(event){
    console.log($('.J__wcEditor').html().length);
    if($('.J__wcEditor').html().length > 7){
        $(".J__wchatSubmit").css("background-color","#08c35e");
        $(".J__wchatSubmit").css("color","#ffffff");
        }else{
        $(".J__wchatSubmit").css("background-color","");
        $(".J__wchatSubmit").css("color","");
        
        }
});
    //-->




    </script>
    <!--key:4c9fd0901d433aa2-->
    <script src="/static/js/groupchat.js?202102004"></script>
    <script src="/static/js/lrz/lrz.all.bundle.js" type="text/javascript"></script>
    

<script>
$(function(){
    $("#sendvoc").on("click", function(){
        recStart();
    }); 
})
var rec,wave,recBlob;
var recOpen=function(){
    rec=null;
    wave=null;
    recBlob=null;
    var newRec=Recorder({
        type:"mp3",sampleRate:16000,bitRate:16
        ,onProcess:function(buffers,powerLevel,bufferDuration,bufferSampleRate,newBufferIdx,asyncEnd){
            document.querySelector(".recpowerx").style.width=powerLevel+"%";
            document.querySelector(".recpowert").innerText=formatMs(bufferDuration,1)+"毫秒";
        }
    });
    createDelayDialog(); 
    newRec.open(function(){
        dialogCancel(); 
        rec=newRec;
    },function(msg,isUserNotAllow){
        dialogCancel();
    });
    window.waitDialogClick=function(){
        dialogCancel();
    };
};

function recClose(){
    if(!(rec&&Recorder.IsOpen())){
        return;
    };
    rec.stop(function(blob,duration){
    },function(msg){
    });
    if(rec){
        rec.close();
        $(".revoc").hide();
        $(".wrap-editor .J__wcEditor").show();
        $(".wrap-editor .J__voc").hide();
        $(".btn-voc").show();
        $(".btn-vocok").hide();
    }
    rec=null;
    wave=null;
    recBlob=null;
};

function recStart(){
    if(rec&&Recorder.IsOpen()){
        recBlob=null;
        rec.start();
        $(".revoc").show();
    }
};

function recStop(){
    if(!(rec&&Recorder.IsOpen())){
        return;
    };
    
    rec.stop(function(blob,duration){
        console.log(blob,(window.URL||webkitURL).createObjectURL(blob),"时长:"+duration+"ms");
        recBlob=blob;
        recUpload();
        recClose();
    },function(msg){
    });
};
function playok(voc){
    var cls=("a"+Math.random()).replace(".","");
    var audio=document.createElement("audio");
    audio.controls=true;
    document.querySelector("#playaudio").appendChild(audio);
    audio.src='/'+voc;
    audio.play();
    setTimeout(function(){
        (window.URL||webkitURL).revokeObjectURL(audio.src);
    },5000);
};

function recPlay(){
    if(!recBlob){
        return;
    };
    
    var cls=("a"+Math.random()).replace(".","");
    var audio=document.createElement("audio");
    audio.controls=true;
    document.querySelector("."+cls).appendChild(audio);
    audio.src=(window.URL||webkitURL).createObjectURL(recBlob);
    audio.play();
    
    setTimeout(function(){
        (window.URL||webkitURL).revokeObjectURL(audio.src);
    },5000);
};
function recUpload(){
    var blob=recBlob;
    if(!blob){
        return;
    };
    
    var api="/message/index/groupvoc?id=1847&fid=9&zt=0";
    var onreadystatechange=function(title){
        return function(){
            if(xhr.readyState==4){

                if(xhr.status==200){

                }else{

                }
            }
        }
    };
    var reader=new FileReader();
    reader.onloadend=function(){
        var postData="";
        postData+="mime="+encodeURIComponent(blob.type);
        
        postData+="&upfile_b64="+encodeURIComponent((/.+;\s*base64\s*,\s*(.+)$/i.exec(reader.result)||[])[1]) 
        var xhr=new XMLHttpRequest();
        xhr.open("POST", api);
        xhr.setRequestHeader("Content-Type","application/x-www-form-urlencoded");
        xhr.onreadystatechange=onreadystatechange("Base64");
        xhr.send(postData);
    };
    reader.readAsDataURL(blob);
    /**

    var form=new FormData();
    form.append("upfile",blob,"recorder.mp3"); 
    
    
    var xhr=new XMLHttpRequest();
    xhr.open("POST", api);
    xhr.onreadystatechange=onreadystatechange("FormData");
    xhr.send(form);
    **/
};


var showDialog=function(){
    if(!/mobile/i.test(navigator.userAgent)){
        return;
        
    };
    dialogCancel();
    
    var div=document.createElement("div");
    document.body.appendChild(div);
    div.innerHTML=(''
        +'<div class="waitDialog" style="z-index:99999;width:100%;height:100%;top:0;left:0;position:fixed;background:rgba(0,0,0,0.3);">'
            +'<div style="display:flex;height:100%;align-items:center;">'
                +'<div style="flex:1;"></div>'
                +'<div style="width:240px;background:#fff;padding:15px 20px;border-radius: 10px;">'
                    +'<div style="padding-bottom:10px;">需要麦克风权限，请允许；如果未看到任何请求，请点击忽略~</div>'
                    +'<div style="text-align:center;"><a onclick="waitDialogClick()" style="color:#0B1">忽略</a></div>'
                +'</div>'
                +'<div style="flex:1;"></div>'
            +'</div>'
        +'</div>');
};
var createDelayDialog=function(){
    dialogInt=setTimeout(function(){
        showDialog();
    },8000);
};
var dialogInt;
var dialogCancel=function(){
    clearTimeout(dialogInt);
    
    //var elems=document.querySelectorAll(".waitDialog");
    //for(var i=0;i<elems.length;i++){
    //  elems[i].parentNode.removeChild(elems[i]);
    //};
};
var formatMs=function(ms,all){
    var f=Math.floor(ms/60000),m=Math.floor(ms/1000)%60;
    var s=(all||f>0?(f<10?"0":"")+f+"分":"")
        +(all||f>0||m>0?("0"+m).substr(-2)+"秒":"")
        +("00"+ms%1000).substr(-3);
    return s;
};
</script>
<style>
    .left_voc{
        width: 100%;
    }
</style>
</body>
</html>
